
<template>
  <div class="top">
      <div class="left" > <qianxi  :select="mapprov" :datas="cityDatas" :style="{width: '100%', height: '700px'}" /></div>
      <div class="right"> <qianxi  :select="mapchina" :datas="provDatas" :style="{width: '100%', height: '700px'}" /></div>


    <!--因为echarts 只内置了世界、中国、中国省的地图文件，如果你要使用市级的地图要去找相关的json或者js文件然后在渲染-->
  </div>
</template>
<script>
import {getByIsKs} from "@/api/ditu/";
import qianxi from './qianxi'
export default {
  name: "FlyMap",
  components: {
    qianxi //地图
  },
  data(){
    return {
      mapchina: 'china',
      mapprov: '河南',
      map_canvas:'26vh',
      // 地图迁徙图设置
      // provDatas:[[{"name":"北京","value":1},{"name":"河南"}]],
      provDatas: [
        [{ name: '黑龙江', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '内蒙古', value:Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '吉林', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '辽宁', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '河北', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '西藏', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '新疆', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '广东', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '海南', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '江西', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '四川', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '青海', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '甘肃', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '云南', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '山东', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '北京', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '山西', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '湖南', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '湖北', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '江苏', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '浙江', value: Math.floor(Math.random() * 50) }, { name: '河南' }],
        [{ name: '浙江', value: Math.floor(Math.random() * 50) }, { name: '福建' }],
      ],
      //  cityDatas: [],
      cityDatas: [
        [{ name: '西华', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '太康', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '驻马店', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '平舆', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '罗山', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '洛宁', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '开封', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '西峡', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '汝州市', value: Math.floor(Math.random() * 500) }, { name: '平顶山' }],
        [{ name: '安阳', value: Math.floor(Math.random() * 1000) }, { name: '平顶山' }],

      ],
    }
  },
  created() {
   this.getHenan(0);
    this.getHenan(1)
  },
  methods:{
    getHenan(value){
      getByIsKs(value).then(res=>{
        if (value==0){
          // this.cityDatas = res.data
        }else {
          // this.provDatas = res.data
        }
      }).catch();
    }
  }
}
</script>
<style>
.top {
  display: flex;
}
.left {
  flex: 5;
}
.right {
  flex: 10;
}
</style>